<template>
	<view class="page">
		<!-- 标题 -->
		<view class="header">
			<text class="title">项目任务清单</text>
			<text class="subtitle">专业项目管理与任务跟踪系统</text>
		</view>
		<!-- 统计 -->
		<view class="stats">
			<view class="stat-card">
				<text class="stat-number">{{ totalTasks }}</text>
				<text class="stat-label">总任务数</text>
			</view>
			<view class="stat-card">
				<text class="stat-number text-green">{{ completedTasks }}</text>
				<text class="stat-label">已完成</text>
			</view>
			<view class="stat-card">
				<text class="stat-number text-blue">{{ inProgressTasks }}</text>
				<text class="stat-label">进行中</text>
			</view>
		</view>
		

		<!-- 任务列表 -->
		<view class="task-list">
			<view v-for="project in projects" :key="project.id" class="task-card">
				<!-- 头部 -->
				<view class="task-header">
					<text class="task-name">{{ project.name }}</text>
					<text :class="['status-badge', getStatusClass(project)]">{{ getStatusLabel(project) }}</text>
				</view>

				<!-- 内容 -->
				<view class="task-body">
					<view class="info-item">
						<text class="label">截止日期</text>
						<text
							:class="['info', isOverdue(project) ? 'text-red' : '']">{{ formatDate(project.deadline) }}</text>
					</view>
					<view class="info-item">
						<text class="label">项目地点</text>
						<text class="info">{{ project.location }}</text>
					</view>
					<view class="info-item">
						<text class="label">负责人</text>
						<text class="info">{{ project.manager }}</text>
					</view>
					<view class="info-item">
						<text class="label">任务内容</text>
						<text class="info">{{ project.content }}</text>
					</view>
				</view>

				<!-- 按钮 -->
				<view class="btn-area">
					<button :class="['btn', getButtonClass(project)]"
						@tap="goToSubtask(project)">
						{{ getButtonText(project) }}
					</button>
				</view>
			</view>
		</view>



	</view>
</template>

<script>
	import {
		getTaskList
	} from "../../utils/getDate.js"
	export default {
		data() {
			return {
				projects: []
			}
		},
		computed: {
			totalTasks() {
				return this.projects.length;
			},
			completedTasks() {
				return this.projects.filter(p => p.isComplete === '已完成').length;
			},
			inProgressTasks() {
				return this.projects.filter(p => p.isComplete === '进行中').length;
			}
		},
		onShow() {
			this.ongetTaskList()
		},
		methods: {
			ongetTaskList() {
				const data = {
					teacherId: uni.getStorageSync("teacher").id
				}

				getTaskList(data).then(res => {
					if (res.state === 'ok') {
						this.projects = res.data.map(item => ({
							id: item.projectId.toString(),
							name: item.title,
							manager: `（项目经理）`,
							deadline: item.endtime,
							location: item.location,
							content: item.taskRequirements,
							isComplete: item.isComplete,
							// 新增字段开始 ----------
							starttime: item.starttime,       // 添加开始时间
							startStatus: item.startStatus  // 添加问题状态
							// 新增字段结束 ----------
						}))
					}
				})
			},

			formatDate(dateStr) {
				const date = new Date(dateStr.replace(/-/g, '/')); 
				return `${date.getFullYear()}年${date.getMonth() + 1}月${date.getDate()}日`;
			},
			
			isOverdue(project) {
				return new Date(project.deadline) < new Date() && project.isComplete !== '已完成';
			},
			
			// 新增方法：检查任务是否可以开始
			canStart(project) {
				if (project.isComplete !== '未开始') return false;
				const now = new Date();
				const startTime = new Date(project.starttime.replace(/-/g, '/'));
				return project.startStatus == 1 && now >= startTime;
			},
			
			getStatusLabel(project) {
				switch(project.isComplete) {
					case '已完成':
						return '已完成';
					case '进行中':
						return this.isOverdue(project) ? '已逾期' : '进行中';
					case '未开始':
						// 修改开始：加入时间判断
						if (this.canStart(project)) return '可开始';
						return this.isOverdue(project) ? '已逾期' : '未开始';
						// 修改结束
					default:
						return '未知状态';
				}
			},
			
			getStatusClass(project) {
				switch(project.isComplete) {
					case '已完成':
						return 'status-completed';
					case '进行中':
						return this.isOverdue(project) ? 'status-overdue' : 'status-progress';
					case '未开始':
						// 修改开始：加入时间判断
						if (this.canStart(project)) return 'status-ready';
						return this.isOverdue(project) ? 'status-overdue' : 'status-pending';
						// 修改结束
					default:
						return '';
				}
			},
			
			getButtonText(project) {
				switch(project.isComplete) {
					case '已完成':
						return '查看任务';
					case '进行中':
						return '继续任务';
					case '未开始':
						// 修改开始：加入时间判断
						return this.canStart(project) ? '开始任务' : '未开始';
						// 修改结束
					default:
						return '开始任务';
				}
			},
			
			getButtonClass(project) {
				switch(project.isComplete) {
					case '已完成':
						return 'btn-disabled';
					case '进行中':
						return 'btn-primary';
					case '未开始':
						// 修改开始：加入时间判断
						return this.canStart(project) ? 'btn-primary' : 'btn-disabled';
						// 修改结束
					default:
						return 'btn-primary';
				}
			},
			
			goToSubtask(project) {
				// 修改开始：允许符合条件的未开始任务
				// if (project.isComplete === '已完成') return;
				if (project.isComplete === '未开始' && !this.canStart(project)) return;
				// 修改结束
				
				uni.navigateTo({
					url: `/pages/TC/Itinerary_son?projectId=${project.id}`
				});
			}
		}
	}
</script>
<style scoped>
	/* 添加未开始状态的样式 */
	.status-pending {
		background-color: #f0ad4e;
		color: white;
	}

	/* 其他样式保持不变 */
	.status-completed {
		background-color: #5cb85c;
		color: white;
	}

	.status-progress {
		background-color: #5bc0de;
		color: white;
	}

	.status-overdue {
		background-color: #d9534f;
		color: white;
	}

	.text-blue {
		color: #5bc0de;
	}

	.page {
		padding: 32rpx;
		font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	}

	.header {
		margin-bottom: 32rpx;
	}

	.title {
		font-size: 40rpx;
		font-weight: bold;
		color: #1e293b;
	}

	.subtitle {
		color: #64748b;
		font-size: 28rpx;
	}

	.task-list {
		margin-bottom: 40rpx;
	}

	.task-card {
		background-color: #fff;
		border-radius: 20rpx;
		padding: 24rpx;
		margin-bottom: 32rpx;
		box-shadow: 0 4rpx 8rpx rgba(0, 0, 0, 0.05);
	}

	.task-header {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.task-name {
		font-size: 34rpx;
		font-weight: bold;
		color: #1e293b;
	}

	.status-badge {
		padding: 8rpx 16rpx;
		border-radius: 999rpx;
		font-size: 24rpx;
	}

	.status-completed {
		background-color: #d1fae5;
		color: #065f46;
	}

	.status-overdue {
		background-color: #fee2e2;
		color: #b91c1c;
	}

	.status-progress {
		background-color: #dbeafe;
		color: #1d4ed8;
	}

	.task-body {
		margin-top: 24rpx;
	}

	.info-item {
		margin-top: 12rpx;
	}

	.label {
		font-size: 24rpx;
		color: #64748b;
	}

	.info {
		font-size: 28rpx;
		color: #1e293b;
	}

	.text-red {
		color: #dc2626;
	}

	.text-green {
		color: #10b981;
	}

	.btn-area {
		margin-top: 24rpx;
		text-align: right;
	}

	.btn {
		font-size: 28rpx;
		padding: 16rpx 40rpx;
		border-radius: 12rpx;
	}

	.btn-primary {
		background-color: #2563eb;
		color: #fff;
	}

	.btn-disabled {
		background-color: grey;
		color: #fff;
	}

	.stats {
		display: flex;
		justify-content: space-between;
		margin-top: 40rpx;
	}

	.stat-card {
		background-color: #fff;
		flex: 1;
		margin: 0 8rpx;
		padding: 24rpx;
		text-align: center;
		border-radius: 20rpx;
		box-shadow: 0 4rpx 8rpx rgba(0, 0, 0, 0.05);
	}

	.stat-number {
		font-size: 40rpx;
		font-weight: bold;
		color: #2563eb;
	}

	.stat-label {
		margin-top: 8rpx;
		font-size: 24rpx;
		color: #64748b;
	}

	.create-btn-wrap {
		margin-top: 40rpx;
		display: flex;
		justify-content: flex-end;
	}


</style>